<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
<style type="text/css">
	body{
		margin: 0;
		padding: 0;
		background-color: #eeeeee;
		font-family: "楷体";
	}
	.item{
		margin: 20px;
		margin-bottom: 50px;
	}
	.imte_top{
		text-align: center;
	}
	.imte_top>span{
		font-size:14px;
		display: inline-block;
		padding: 5px 12px;
		background-color: #ddd;
		color:#fff;
		border-radius: 5px;
	}
	.item_content{
		background-color: #fff;
		padding: 25px 15px;
		margin-top: 6px;
	}
	.item_content_top_1{
		font-size: 24px;
		font-weight: bold;
	}
	.item_content_top_2{
		color:#eee;
		font-size: 14px;
		margin: 5px 0px;
	}
	.item_content_top_3{
		margin: 10px 0px;
	}
	.item_content_top_4{
		margin: 10px 0px;
	}
	.item_content_bottom>a{
		text-decoration: none;
		color:#33e;
	}
</style>
</head>
<body>
	
	<div class="content">
	</div>
	<div class="content">
	</div>
</body>

<script src="qrcode/jquery2.1.4.js"></script>
<script src="layer/layer.js"></script>
<script>
	$(function (){
		$.getJSON("/wx/expressFindByPhone.do",null,function (data){
			if (data.status == 0){
				let data_status0 = data.data.status0;
				let data_status1 = data.data.status1;
				// 循环拼接取件的快递
				for (let i = 0 ; i < data_status0.length ; i++){

					let item = `<div class="item">
\t\t\t<div class="imte_top"><span>`+data_status0[i].inTime+`</span></div>
\t\t\t<div class="item_content">
\t\t\t\t<div class="item_content_top">
\t\t\t\t\t<div class="item_content_top_1">取件通知</div>
\t\t\t\t\t<div class="item_content_top_2">`+data_status0[i].inTime+`</div>
\t\t\t\t\t<div class="item_content_top_3">您有一个包裹到e栈了!</div>
\t\t\t\t\t<div class="item_content_top_4">
\t\t\t\t\t\t取件码:<span style="color:#05a">`+data_status0[i].code+`</span><br>
\t\t\t\t\t\t快递公司:`+data_status0[i].company+`<br>
\t\t\t\t\t\t运单号码:`+data_status0[i].number+`<br>
\t\t\t\t\t\t站点电话:`+data_status0[i].sysPhone+`<br>
\t\t\t\t\t\t取件地址:学校快件集散中心<br>
\t\t\t\t\t</div>
\t\t\t\t</div>
\t\t\t\t<hr>
\t\t\t\t<div class="item_content_bottom">
\t\t\t\t\t<a href="/wx/createQrcode.do?type=express&code=`+data_status0[i].code+`">二维码</a>
\t\t\t\t</div>
\t\t\t</div>
\t\t</div>`
					// 添加到div中
					$(".content:eq(0)").append($(item));
				}

				// 循环拼接未取件的快递消息
				for (let i = 0 ; i < data_status1.length ; i++) {
					let item = `<div class="item">
\t\t\t<div class="imte_top"><span>`+data_status1[i].outTime+`</span></div>
\t\t\t<div class="item_content">
\t\t\t\t<div class="item_content_top">
\t\t\t\t\t<div class="item_content_top_1">取件成功通知</div>
\t\t\t\t\t<div class="item_content_top_2">`+data_status1[i].outTime+`</div>
\t\t\t\t\t<div class="item_content_top_3">您有一个包裹从e栈取出了!</div>
\t\t\t\t\t<div class="item_content_top_4">
\t\t\t\t\t\t快递公司:`+data_status1[i].company+`<br>
\t\t\t\t\t\t运单号码:`+data_status1[i].number+`<br>
\t\t\t\t\t\t站点电话:`+data_status1[i].sysPhone+`<br>
\t\t\t\t\t</div>
\t\t\t\t</div>
\t\t\t\t<hr>
\t\t\t\t<div class="item_content_bottom">
\t\t\t\t\t<a href="#">有疑问 ? 点了也没用</a>
\t\t\t\t</div>
\t\t\t</div>
\t\t</div>`

					// 添加 div 中
					$(".content:eq(1)").append($(item));
				}
			} else{
				layer.msg("没有快递消息");
				var item = `<div class="item_content">
	\t\t\t\t<div class="item_content_top">
	\t\t\t\t\t<div class="item_content_top_1">您还没有任何的快递消息</div>
	\t\t\t\t\t<div class="item_content_top_3">欢迎存取快递！</div>
	\t\t\t\t\t<div class="item_content_top_4">
	\t\t\t\t\t</div>
	\t\t\t\t</div>
	\t\t\t\t<hr>
	\t\t\t</div>`
				$(".content:eq(1)").append($(item));
			}

		})
	})

</script>
</html>